<template>
	<view class="import1">
		
		<view :class="biji.indexOf(1) !== -1 ? 'import1-avacity' : '' " @click="numberClick(1)">1</view>
		<view :class="biji.indexOf(2) !== -1 ? 'import1-avacity' : '' " @click="numberClick(2)">2</view>
		<view :class="biji.indexOf(3) !== -1 ? 'import1-avacity' : '' " @click="numberClick(3)">3</view>
		<view :class="biji.indexOf(4) !== -1 ? 'import1-avacity' : '' " @click="numberClick(4)">4</view>
		<block >
			<view :class="biji.indexOf(5) !== -1 ? 'import1-avacity' : '' " @click="numberClick(5)">5</view>
			<view :class="biji.indexOf(6) !== -1 ? 'import1-avacity' : '' " @click="numberClick(6)">6</view>
			
		</block>
		<block >
			<view :class="biji.indexOf(7) !== -1 ? 'import1-avacity' : '' " @click="numberClick(7)">7</view>
			<view :class="biji.indexOf(8) !== -1 ? 'import1-avacity' : '' " @click="numberClick(8)">8</view>
			<view :class="biji.indexOf(9) !== -1 ? 'import1-avacity' : '' " @click="numberClick(9)">9</view>
		</block>	
		
	</view>
</template>

<script>
	export default {
		props: ['info','index','index1','bijireplace'],
		watch:{
			info(e){
				this.bijichange(e)
			},
			index(e){
				this.index   =e;
			},
			index1(e){
				this.index1  = e;
			},
			bijireplace(e){
				console.log(this.index);
				console.log(this.index1);
				this.bijichange(e)
			}
		},
		data() {
			return {
				biji  :  []
			}
		},
		created() {
			console.log(this.index);
			console.log(this.index1);
			if(this.index  != ''){
				this.bijichange(this.info)
			}
			console.log(this.info);
		},
		methods:{
			numberClick(e){
				this.$emit('bijiNumChange',e);
			},
			bijichange(e){			
				if(this.info['cid'] == 12 || this.info['cid'] == 13 || this.info['cid'] == 15 || this.info['cid'] == 19){
				
					this.biji  = this.info.body['rule'][this.index][this.index1]['biji'];
				}else{
					this.biji  = this.info.body[this.index][this.index1]['biji'];
				}
			}
				
			
		}
	}
</script>

<style>
	.import1 {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	}
	.import1 > view {
		font-size: 44rpx;
		flex: 1;
		line-height: 100rpx;
		text-align: center;
		margin-left: 20rpx;
		margin-right: 20rpx;
		margin-bottom: 20rpx;
	}
	.import1-avacity {
		color: #3eb8ff;
	}
	
</style>